<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich"
	template="/templates/css/plantilla2.html">

	<ui:define name="content">
		<h:panelGrid columns="2" border="1">
			<h:form>
				<h:panelGrid border="1">

					<rich:panel style="width:220px;">
						<f:facet name="header">
							<h:outputText value="Seleccione Elemento a Registrar"></h:outputText>
						</f:facet>
					Elemento<rich:select enableManualInput="true"
							defaultLabel="start typing for select">
							<f:selectItems value="#{DocenteBean.DescripcionElemento()}" />
						</rich:select>
					</rich:panel>
					<h:commandButton action="#{DocenteBean.registrarElementoMultimedia()}"
						value="Agregar" />

					<a4j:status onstart="#{rich:component('statPane')}.show()"
						onstop="#{rich:component('statPane')}.hide()" />
					<h:form id="form">
						<rich:dataTable value="#{carsBean.allInventoryItems}" var="car"
							iterationStatusVar="it" id="table" rows="15">
							<rich:column>
								<f:facet name="header">#</f:facet>
                #{it.index}
            </rich:column>
							<rich:column>
								<f:facet name="header">Elemento A Registrar</f:facet>
								<h:outputText value="#{DocenteBean.nombreElemento()}" />
							</rich:column>
							<rich:column>
								<a4j:commandLink styleClass="no-decor" execute="@this"
									render="@none"
									oncomplete="#{rich:component('confirmPane')}.show()">
									<h:graphicImage value="/images/icons/delete.gif" alt="Eliminar" />
									<a4j:param value="#{it.index}"
										assignTo="#{carsBean.currentCarIndex}" />
								</a4j:commandLink>
							</rich:column>

						</rich:dataTable>

						<a4j:jsFunction name="remove"
							action="#{EstBean.cancelarMateria()}" render="table"
							execute="@this"
							oncomplete="#{rich:component('confirmPane')}.hide();" />

						<rich:popupPanel id="statPane" autosized="true">
							<h:graphicImage value="/images/ai.gif" alt="ai" />
        Por Favor Espere...
    </rich:popupPanel>

						<rich:popupPanel id="confirmPane" autosized="true"> 
        Estas Seguro?
        <a4j:commandButton value="Cancel"
								onclick="#{rich:component('confirmPane')}.hide(); return false;" />
							<a4j:commandButton value="Delete"
								onclick="remove(); return false;" />
						</rich:popupPanel>

					</h:form>

				</h:panelGrid>

			</h:form>

			<h:form id="form">
				<rich:dataTable value="#{EstBean.todosLosDatosDeHorario()}"
					var="hor" id="table" rows="20" rowClasses="odd-row, even-row"
					styleClass="stable">
					<rich:column>
						<f:facet name="header">
							<h:outputText value="Horas" />
						</f:facet>
						<h:outputText value="#{EstBean.consultarHoras()}" />
					</rich:column>
					<rich:column>
						<f:facet name="header">
							<h:outputText value="Lunes" />
						</f:facet>
						<h:outputText value="#{DocenteBean.consultarHorarioPorDiaElm()}" />
					</rich:column>
					<rich:column>
						<f:facet name="header">
							<h:outputText value="Martes" />
						</f:facet>
						<h:outputText value="#{DocenteBean.consultarHorarioPorDiaElm()}" />
					</rich:column>
					<rich:column>
						<f:facet name="header">
							<h:outputText value="Miercoles" />
						</f:facet>
						<h:outputText value="#{DocenteBean.consultarHorarioPorDiaElm()}" />
					</rich:column>
					<rich:column>
						<f:facet name="header">
							<h:outputText value="Jueves" />
						</f:facet>
						<h:outputText value="#{DocenteBean.consultarHorarioPorDiaElm()}" />
					</rich:column>
					<rich:column>
						<f:facet name="header">
							<h:outputText value="Viernes" />
						</f:facet>
						<h:outputText value="#{DocenteBean.consultarHorarioPorDiaElm()}" />
					</rich:column>
					<rich:column>
						<f:facet name="header">
							<h:outputText value="Sabado" />
						</f:facet>
						<h:outputText value="#{DocenteBean.consultarHorarioPorDiaElm()}" />
					</rich:column>
				</rich:dataTable>
			</h:form>

			<rich:jQuery selector=".stable tr:odd" query="addClass('odd-row')" />
			<rich:jQuery selector=".stable tr:even" query="addClass('even-row')" />
			<rich:jQuery selector=".stable tr" event="mouseover"
				query="jQuery(this).addClass('active-row')" />
			<rich:jQuery selector=".stable tr" event="mouseout"
				query="jQuery(this).removeClass('active-row')" />
		</h:panelGrid>

	</ui:define>
</ui:composition>